// SPDX-License-Identifier: GPL-3.0-or-later

import QtQuick
import Qt5Compat.GraphicalEffects

import Fk
import Fk.Components.Common
import Fk.Components.LunarLTK

import Fk.Components.GameCommon as Game

Game.BasicItem {
  ListModel {
    id: equips // TODO：只显示了一张
  }

  property int cid: 0
  property string name: ""
  property string suit: ""
  property int number: 0
  property bool sealed: false
  property string subtype
  property string skill: ""
  property bool asSkill: false

  property string icon: ""
  property int _index: 0
  property alias text: textItem.text

  selectable: false

  hoverHandler.cursorShape: selectable ? Qt.PointingHandCursor : Qt.ArrowCursor

  id: root
  Rectangle {
    anchors.fill: bg
    id: maskRect
    color: sealed ? "#7a7a7a" : "black"
  }

  Image {
    id: bg
    anchors.fill: parent
    source: Cpp.path + "/packages/lunarltk-qsgs-ui/image/selfArea/equip-item.png"

    Image {
      source: Cpp.path + "/packages/lunarltk-qsgs-ui/image/selfArea/equip-item-selected.png"
      anchors.fill: parent
      anchors.leftMargin: -5
      anchors.rightMargin: -5
      anchors.topMargin: -4
      anchors.bottomMargin: -5
      visible: root.selected && !root.sealed
    }
  }

  Rectangle {
    anchors.fill: parent
    radius: 2
    visible: sealed
    color: "#CCC"
    opacity: 0.8
  }


  Image {
    id: iconItem
    y: (parent.height / 2) - (height / 2)
    x: 3

    fillMode: Image.PreserveAspectFit
    height: parent.height

    source: {
      if (sealed)
        return SkinBank.equipIconDir + "sealed";
      return icon ? SkinBank.getEquipIcon(cid, icon) : "";
    }
  }


  OpacityMask {
    anchors.fill: iconItem
    source: maskRect       // 被填充的颜色
    maskSource: Image {       // mask PNG
      source: iconItem.source
    }
  }

  Image {
    id: suitItem
    anchors.right: parent.right
    anchors.rightMargin: -2
    source: (suit && !sealed) ? SkinBank.cardSuitDir + suit : ""
    width: implicitWidth / implicitHeight * height
    height: 16
    y: 0
  }

  GlowText {
    id: numberItem
    visible: !sealed && number > 0 && number < 14
    text: Util.convertNumber(number)
    color: {
      if (suit == "heart" || suit == "diamond") {
        return "#9F151B";
      }
      return "black";
    }
    font.family: Config.libianName
    font.pixelSize: 13
    font.bold: true
    glow.color: "#FEFEBD"
    glow.spread: 0.7
    glow.radius: 1.5
    y: 0
    x: parent.width - 21.5
  }

  GlowText {
    id: specialTextItem
    text: {
      if (root.cid === 0) return "";
      if (root.subtype === "offensive_ride") return "-1";
      if (root.subtype === "defensive_ride") return "+1";
      if (root.subtype === "weapon") {
        return Lua.evaluate(`(function()
          local numList = {"零", "一", "二", "三", "四", "五", "六", "七", "八", "九", "十", "十一", "十二", "十三"}
          local num = (ClientInstance:getCardOwner(${root.cid}):getVirtualEquip(${root.cid}) or Fk:getCardById(${root.cid})).attack_range
          if num then
            return numList[num + 1] or "X"
          else
            return ""
          end
        end)()
        `)
      }
      return "";
    }
    font.family: Config.li2Name
    font.pixelSize: 13
    glow.color: "#FEFEBD"
    glow.spread: 0.75
    glow.radius: 1.5
    anchors.verticalCenter: parent.verticalCenter
    x: 20
    y: 2
  }

  GlowText {
    id: textItem
    // text: root.cid === 0 ? "" : (translate_text.length < 6 ? translate_text : translate_text.slice(0, 4) + "…")
    font.family: Config.li2Name
    font.bold: true
    color: sealed ? "#7a7a7a" : "#000000"
    glow.color: sealed ? '#d1d0d0' : '#FEFEBD'
    glow.spread: 0.75
    glow.radius: 2
    font.pixelSize: 13
    x: sealed ? 20 : 35
    y: (parent.height / 2) - (font.pixelSize / 2) - 1

    property string _text: ""
    property string translate_text: root.cid !== 0 ? Lua.evaluate(`
    Fk:translate((
      ClientInstance:getCardOwner(${root.cid}):getVirualEquip(${root.cid}) or
      Fk:getCardById(${root.cid})
    ).name)`) : ""
  }

  ParallelAnimation {
    id: showAnime

    NumberAnimation {
      target: root
      property: "x"
      duration: 200
      easing.type: Easing.InOutQuad
      from: 10
      to: 0
    }

    NumberAnimation {
      target: root
      property: "opacity"
      duration: 200
      easing.type: Easing.InOutQuad
      from: 0
      to: 1
    }
  }

  ParallelAnimation {
    id: hideAnime

    NumberAnimation {
      target: root
      property: "x"
      duration: 200
      easing.type: Easing.InOutQuad
      from: 0
      to: 10
    }

    NumberAnimation {
      target: root
      property: "opacity"
      duration: 200
      easing.type: Easing.InOutQuad
      from: 1
      to: 0
    }
  }

  HoverHandler {
    id: hover
    onHoveredChanged: {
      if (hovered && !root.sealed && root.cid !== 0) {
        equipDetail.visible = true;
      } else {
        equipDetail.visible = false;
      }
    }
  }

  Rectangle {
    id: equipDetail
    anchors.left: parent.left
    anchors.leftMargin: 10
    anchors.bottom: parent.top
    anchors.bottomMargin: 2 + root._index * 20.2
    width: 350
    height: Math.max(detailName.contentHeight + detailText.contentHeight + textSlash.contentHeight + 22, 120)
    color: "transparent"
    visible: false

    Rectangle {
      anchors.fill: parent
      color: '#cc1d1d1d'
      radius: 1
    }

    CardItem {
      id: cardImg
      cid: root.cid
      name: root.name
      suit: root.suit
      number: root.number
      autoBack: false
      cardScale: 0.8
      anchors.left: parent.left
      anchors.leftMargin: 8
      anchors.top: parent.top
      anchors.topMargin: 8
    }

    Text {
      id: detailName
      text: Lua.tr(root.name)
      font.pixelSize: 15
      font.family: "SimSun"
      font.bold: true
      wrapMode: Text.WordWrap
      textFormat: TextEdit.RichText
      color: '#ffefb7'
      anchors.right: parent.right
      anchors.rightMargin: 8
      anchors.left: cardImg.right
      anchors.leftMargin: 8
      anchors.top: parent.top
      anchors.topMargin: 8
    }

    Text {
      id: textSlash
      text: "<hr>"
      color: detailName.color
      font.pixelSize: 3
      font.family: "SimSun"
      wrapMode: Text.WordWrap
      textFormat: TextEdit.RichText
      anchors.right: parent.right
      anchors.rightMargin: 8
      anchors.left: cardImg.right
      anchors.leftMargin: 8
      anchors.top: detailName.bottom
      anchors.topMargin: 0
    }

    Text {
      id: detailText
      text: "<b>" + Lua.tr(":" + root.name) + "</b>"
      font.pixelSize: 10
      font.family: "SimSun"
      wrapMode: Text.WordWrap
      textFormat: TextEdit.RichText
      color: detailName.color
      anchors.right: parent.right
      anchors.rightMargin: 8
      anchors.left: cardImg.right
      anchors.leftMargin: 8
      anchors.top: textSlash.bottom
      anchors.topMargin: 6
    }

    BorderImage {
      source: Cpp.path + "/packages/lunarltk-qsgs-ui/image/selfArea/skill/skill-detail-frame.png"
      border.left: 25
      border.right: 25
      border.top: 25
      border.bottom: 25
      anchors.fill: parent
      anchors.margins: -1
    }

  }

  function reset()
  {
    cid = 0;
    name = "";
    suit = "";
    number = 0;
    text = "";
    icon = "";
    subtype = "";
    skill = "";
    asSkill = false;
    selectable = false;
    selected = false;

    if (sealed) {
      text = '  ' + Lua.tr(subtype + "_sealed");
    }
  }

  function setCard(card)
  {
    cid = card.cid;
    name = card.name;
    suit = card.suit;
    number = card.number;
    text = card.text;
    icon = card.icon;
  }

  function addCard(card) {
    let iconName = "";
    let displayText = "";
    if (card.subtype === "defensive_ride" || card.subtype === "offensive_ride") {
      iconName = "horse";
    } else {
      iconName = card.name;
    }
    displayText = Lua.tr(card.name);
    subtype = card.subtype;
    let newModel = {
      name: card.name,
      cid: card.cid,
      suit: card.suit,
      number: card.number,
      text: displayText,
      icon: iconName,
    }
    setCard(newModel);
    equips.append(newModel);
  }

  function removeCard(cid) {
    let index = indexOfCard(cid);
    if (index === -1) return;
    equips.remove(index);
    if (equips.count === 0) {
      reset();
      hide();
    } else {
      const card = equips.get(0);
      setCard(card);
    }
  }

  function indexOfCard(cid) {
    let index = -1;
    for (let i = 0; i < equips.count; i++) {
      if (equips.get(i).cid === cid) {
        index = i;
        break;
      }
    }
    return index;
  }

  function containCard(cid) {
    return indexOfCard(cid) > -1;
  }

  function show() {
    if (!sealed) {
      showAnime.start();
    }
  }

  function hide() {
    if (!sealed) {
      hideAnime.start();
    }
  }

  onSealedChanged: {
    showAnime.stop();
    hideAnime.stop();
    x = 0;

    opacity = sealed ? 1 : 0;
    text = '  ' + Lua.tr(subtype + "_sealed")
  }
}
